import {
  createContext,
  useEffect,
  useRef,
} from 'react'

import { createWorkflowStore } from './store'

type WorkflowStore = ReturnType<typeof createWorkflowStore>
export const WorkflowContext = createContext<WorkflowStore | null>(null)

type WorkflowProviderProps = {
  children: React.ReactNode,
  sourceFile: string,
}
export const WorkflowContextProvider = ({ children, sourceFile }: WorkflowProviderProps) => {
  const storeRef = useRef<WorkflowStore>()

  if (!storeRef.current)
    storeRef.current = createWorkflowStore(sourceFile)

  useEffect(() => {
    storeRef.current = createWorkflowStore(sourceFile)
  }, [sourceFile]);

  return (
    <WorkflowContext.Provider value={storeRef.current}>
      {children}
    </WorkflowContext.Provider>
  )
}
